<template>
  <div class="DetalMaintain">
    <div class="head">
      <div v-if="pass1" class="nopass"><van-icon name="star" /><span>未维修</span></div>
      <div v-if="pass2" class="pass"><van-icon name="star" /><span>已维修</span></div>
    </div>
    <div class="contaion">
      <van-row type="flex" justify="space-between">
        <van-col span="6">
          <div class="img">
            <van-image width="10rem" height="10rem" fit="cover" src="https://img.yzcdn.cn/vant/cat.jpeg"/>
          </div>
        </van-col>
        <van-col offset="2" span="16">
          <div class="text">
            <h3>测试测试测试测试测试测试测试测试测试</h3>
          </div>
        </van-col>
      </van-row>
    </div>
  </div>
</template>

<script>
import Vue from 'vue'
import { NavBar, Col, Row, Image as VanImage, icon } from 'vant'
Vue.use(NavBar).use(Col).use(Row).use(VanImage).use(icon)
export default{
  name: 'DetalMaintain',
  data () {
    return {
      pass1: 0,
      pass2: 1
    }
  },
  methods: {
  }
}
</script>

<style scoped>
.head,.text{
  text-align:left
}
.nopass{
  color: rgb(228, 27, 27);
}
.pass{
  color: rgb(34, 233, 77);
}
.DetalMaintain{
  height: 30%;
  width: 100%;
  margin: 3% 0 0 0 ;
  background-color: rgb(255, 255, 255);
  padding: 5px;
}
</style>
